<!--服务订单 -->
<template>
	<view class="main">
		<view>
			<view>
			</view>
			<view class="avatar-info">
				<input type="text"
				  placeholder="请输入运单号、品名、收货人电话查询"
				  v-model="inputValue"
				  class="contact-info"
				  @input="searchItemsByKeyword"></input>
			</view>
		</view>
	
	<view v-if="items.length === 0" class="empty-state">
	    <view class="content-center">
	            <img src="../../../../static/空数据.png" style="height:150px;width:180px;">
	            <view style="font-size:20px;margin-top:10px;text-align:center;">暂无数据!</view>
	        </view>
	</view>
	<view v-else style="margin-top: 7vh;padding: 0px 10px;">
	<u-checkbox-group   :key="checkboxKey" v-model="selectedValues"  placement="column" @change="checkboxChange">
					<view v-for="(item, index) in items" :key="index" class="u-outer-content-list" >
						<view><u-checkbox :name="item.id" shape="circle"></u-checkbox></view>
						<view style="width: 100%;">
							<view class="u-content">
									<view class="u-content-list">
										<view class="u-avatar-list2">
											<view>
												<text class="u-options-yun">运单号</text>
												<!-- <span class="delivery-options" v-if="item.waybillNumber!=null">{{item.waybillNumber}}</span> -->
												<text class="u-delivery-options1">{{item.waybillNumber}}</text>
											</view>
											<view>
												<view class="u-price" style="text-align: center;">费用</view>
												<text class="u-money" v-if="currentIndex===0||currentIndex===1||currentIndex===2">￥{{item.sanbaoCost.toFixed(2)}}</text>
												<text class="u-money" v-if="currentIndex===3">￥{{item.compensate.toFixed(2)}}</text>
											</view>
										</view>
									</view>
								</view>
							<view class="u-content-list-1">
								<view class="u-avatar-list">
								<text class="u-shipment">货件信息</text>
								<text class="u-description" v-if="item.description!=null">{{item.description}}</text>
								<text class="u-algebra" v-if="item.number!=null">{{item.number}}件</text>
								<text class="u-one"> 1 </text>
								<text class="u-kg" v-if="item.weight!=null">{{item.weight}}kg</text>
								<text class="u-meter" v-if="item.volume!=null">{{item.volume}}m³</text>
								</view>
							</view>
							<view class="u-content-list-3">
								<view class="u-avatar-list">
								<text class="u-package">包装内容</text>
								<text class="u-artNumber" v-if="item.installContent!=null">{{item.installContent}}</text>
								</view>
							</view>
							<view class="u-content-list-7">
								<view class="u-avatar-list" style="display: flex;flex-direction: row;align-items: center;">
								<view class="u-options">送货地址</view>
								<view class="u-delivery-options" v-if="item.destinationStation!=null">到站:{{item.destinationStation}}<text v-if="item.consigneeDetailedAddress!=null">{{item.consigneeDetailedAddress}}</text></view>
								<view class="u-delivery-axis"  @click="HeadMap(index,item)"><image src="../../../../static/坐标.png"></image></view>
								</view>
							</view>
							<view class="u-content-list-6">
								<view class="u-avatar-list">
								<text class="u-options">收货人</text>
								<text class="u-delivery-options" v-if="item.putUserName!=null">{{item.putUserName}}</text>
								<text class="u-delivery-number" v-if="item.putPhone!=null" @click="call(item,index)">{{item.putPhone}}</text>
								<text class="u-delivery-icon"><image src="../../../static/电话.png"></image></text>
								</view>
							</view>
							<view class="u-content-list-13">
								<view class="u-avatar-list13">
								<text class="u-options">备注说明</text>
								<text class="u-delivery-options"></text>
								</view>
							</view>
							<div class="end"></div>
								
						</view>
						
					</view>
						</u-checkbox-group>
	</view>
	<view>
		<view class="end2" v-if="items.length > 0" ></view>
		<view class="u-postion">
			<text>合计： {{items.length}}条记录</text>
			<u-button type="warning" size="large" text="申请核销" @click="handleAdd()"></u-button>
		</view>
	</view>
	<!-- <view class="content-list-15">
		<view class="avatar-order">
		<text>合计： {{items.length}}条记录</text>
		</view>
	</view> -->
	</view>
</template>

<script>
	import {apply,applyAdd} from '@/api/check.js';
	export default {
		data() {
			return {
				items:[
				],
				req:{},
				item:{},
				phone:'',
				currentIndex:0,
				queryResult:[],
				inputValue:'',
				abnormalId:'',
				selectedValues:[],
				selectedList:[]
			}
		},
		onLoad(options) {
			this.phone=options.phone
			console.log(this.phone);
			this.getList();
		    },
		mounted(){
			this.getList();
		},
		methods: {
			getList(){
				apply({contactInformation:this.phone}).then(res =>{
					this.items=res.data.data
					this.queryResult=res.data.data
				}).catch((error) => {
				});
			},
		
			 checkboxChange(value) {
				  console.log(value)
			      this.selectedValues =value;
						 console.log( this.selectedValues)
			    },
			handleAdd(){
				uni.showLoading({
				        title: '加载中'
				  })
					setTimeout(() => {
				const name = uni.getStorageSync("userName");
				if(this.selectedValues.length===0){
					uni.showToast({
						        title: '申请失败',
						        icon: 'error',
					});
					return;
				}
				this.selectedValues.forEach(id => {
					const foundItem = this.items.find(item => String(item.id) === String(id));
					if (foundItem) {
						const item = {
							assignBusinessId: id,          // 当前处理的 id
							businessId: foundItem.businessId, // 从查询结果中获取
							createBy: name                // 从缓存中获取的用户名
						};
						const isExist = this.selectedList.some(
							selectedItem => selectedItem.assignBusinessId === id
						);
						
						if (!isExist) {
							this.selectedList = [...this.selectedList, item];
						}
					}
				});
				console.log(this.selectedList)
				applyAdd(this.selectedList).then(res =>{
					if(res.data.code===500 || res.data.code===400 || res.data.code===503){
							uni.showToast({
									title: res.data.errorMessage,
									icon: 'error',
							});
						return;
							uni.hideLoading()
					}else{
						uni.showToast({
							        title: '申请成功',
							        icon: 'success',
						});
					
						
						this.getList();
					this.selectedValues = [];
					this.checkboxKey++; // 强制重新渲染组件
					}
				}).catch((error) => {
						uni.hideLoading()
				});
				uni.hideLoading()
				}, 1500);
			},
			showInputModal(item, index) {
				this.item=item;
				this.abnormalId=item.id
			      this.$refs.inputModal.showModal('预约', {
			        onConfirm: (value) => {
			          console.log('用户输入:', value);
			          // 在这里处理用户输入的内容
			        },
			        onCancel: () => {
			          console.log('用户取消了输入');
			        }
			      });
			    },
			abnormalToOrder(item,index){
				const businessId = item.businessId;
				const id = item.id;
				uni.navigateTo({
					url: '/pages/index/pictureToast/pictureToast?businessId='+businessId+"&phone="+ this.phone+"&id="+ id// 请注意，这里的url应为相对路径，且以'/'开头
				});
			},
			call(item,index){
				const phoneNumber=item.putPhone
				this.callPhone(phoneNumber)
			},
			callPhone(phoneNumber) {
			        // 检查传入的电话号码是否为空或格式不正确
			        if (!phoneNumber || typeof phoneNumber !== 'string' || !/^\d+$/.test(phoneNumber)) {
			            uni.showToast({
			                title: '电话号码格式不正确',
			                icon: 'none'
			            });
			            return;
			        }
			 
			        // 使用uni.makePhoneCall发起电话拨打请求
			        uni.makePhoneCall({
			            phoneNumber: phoneNumber, // 此处填写要拨打的电话号码
			            success: function () {
			                // 用户确认拨打后，此回调会被触发
			                console.log('用户已确认拨打');
			            },
			            fail: function (err) {
			                // 用户取消拨打或拨打电话失败时，此回调会被触发
			                console.error('拨打电话失败：', err);
			                uni.showToast({
			                    title: '拨打电话失败，请检查您的设置或重试',
			                    icon: 'none'
			                });
			            }
			        });
			    },
			searchItemsByKeyword() {
				 let keyword = '';
				  if (this.inputValue !== undefined && this.inputValue !== null) {
				      keyword = this.inputValue.toLowerCase();
				  }else{
					  this.items
				  }
			        this.queryResult  = this.items.filter(item => {
			            return (
							(item.waybillNumber !== null &&item.waybillNumber.toLowerCase().includes(keyword)) ||
							(item.description !== null &&item.description.toLowerCase().includes(keyword)) ||
							(item.putUserName !== null &&item.putUserName.toLowerCase().includes(keyword)) ||
							(item.putPlane !== null &&item.putPlane.toLowerCase().includes(keyword))
			            );
			        });
					// this.items=this.queryResult;
			    },
			handleDataFromChild(data){
				this.items=data.items
				this.queryResult=data.items
				// 接收来自子组件的数据
				this.currentIndex = data.currentIndex;
			}		}
	}
</script>

<style scoped>
@import "apply.css";
</style>
